@import 'tailwindcss';
@import './component-styles.css';
@plugin "@tailwindcss/forms";
@plugin "@tailwindcss/typography";
@custom-variant dark (&:where(.dark, .dark *));

@source '../../../../../app/Filament/**/*.php';
@source '../../../../../resources/views/filament/**/*.blade.php';
@source '../../../../../vendor/filament/**/*.blade.php';
@source '../../../../../vendor/laravel/framework/src/Illuminate/Pagination/resources/views/*.blade.php';
@source '../../../../../resources/views/**/*.blade.php';
@source '../../../../../resources/views/components/**/*.blade.php';
@source '../../../../../resources/views/components/blade.php';
@source '../../../../../wave/resources/views/**/*.blade.php';
@source '../../../../../resources/themes/anchor/**/*.blade.php';
@source '../../../../../resources/plugins/**/*.php';
@source '../../../../../config/*.php';


[x-cloak]{
  display:none;
}

.wave {
  animation: wave 3s linear;
  animation-iteration-count:infinite;
  fill: #4e80ee;
}

  #wave2 {
    animation-duration:5s;
    animation-direction: reverse;
    opacity: .6
  }
  #wave3 {
    animation-duration: 7s;
    opacity:.3;
  }
  @keyframes drop {
    0% {
      transform: translateY(80%);
      opacity:.6;
    }
    80% {
      transform: translateY(80%);
      opacity:.6;
    }
    90% {
      transform: translateY(10%) ;
      opacity:.6;
    }
    100% {
      transform: translateY(0%) scale(1.5);
      stroke-width:0.2;
      opacity:0;
    }
  }
  @keyframes wave {
    to {transform: translateX(-100%);}
  }

  .form-control{
    @apply w-full form-input;
  }

/****** Form Input CLASSES **********/



.form-select{
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M7 7l3-3 3 3m0 6l-3 3-3-3' stroke='%239fa6b2' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-position: right .5rem center;
    background-size: 1.5em 1.5em;
    padding:.5rem 2.5rem .5rem .75rem;
    background-repeat: no-repeat;
}

.prose {
  blockquote{
    @apply py-3 border-l-4 bg-zinc-100 border-zinc-300;
  }
}

@layer base {
  html, body{
    p{
      @apply text-gray-500 dark:text-gray-400;
    }
  }
}

.scrollbar-hidden::-webkit-scrollbar {
  display: none;
}

/* For IE, Edge and Firefox */
.scrollbar-hidden {
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
}

:root {
  --primary-50:  #111827;
  --primary-100: #111827;
  --primary-200: #111827;
  --primary-300: #111827;
  --primary-400: #111827;
  --primary-500: #111827;
  --primary-600: #111827;
  --primary-700: #111827;
  --primary-800: #111827;
  --primary-900: #111827;
  --primary-950: #111827;
}

/** The following are CSS files needed by Filament for components, table builder, etc. 
https://github.com/filamentphp/filament/blob/4.x/docs/01-introduction/02-installation.md#configuring-styles
**/

/* Required by all components */
@import '../../../../../vendor/filament/support/resources/css/index.css';

/* Required by actions and tables */
@import '../../../../../vendor/filament/actions/resources/css/index.css';

/* Required by actions, forms and tables */
@import '../../../../../vendor/filament/forms/resources/css/index.css';

/* Required by actions and infolists */
@import '../../../../../vendor/filament/infolists/resources/css/index.css';

/* Required by notifications */
@import '../../../../../vendor/filament/notifications/resources/css/index.css';

/* Required by actions, infolists, forms, schemas and tables */
@import '../../../../../vendor/filament/schemas/resources/css/index.css';

/* Required by tables */
@import '../../../../../vendor/filament/tables/resources/css/index.css';

/* Required by widgets */
@import '../../../../../vendor/filament/widgets/resources/css/index.css';
